/*===========================================================================*/
/*1366px CSS*/
/*===========================================================================*/
@media ( max-width : 1366px) {
	#banner .caption {
		top: 150px;
	}
	#banner .caption span img {
		margin-bottom: 0;
	}
	#banner .caption .firma {
		font-size: 60px;
	}
	#nav li ul li>ul {
		left: inherit;
		right: 100%;
	}
	.top-menu .dropdown-menu {
		left: -300px;
	}
	.top-menu .dropdown-menu::before {
		left: 335px;
	}
}

/*===========================================================================*/
/*1280px CSS*/
/*===========================================================================*/
@media ( max-width : 1280px) {
	#banner .caption {
		top: 150px;
	}
	#banner .caption span img {
		margin-bottom: 0;
	}
	#nav li ul li>ul {
		left: inherit;
		right: 100%;
	}
	.top-menu .dropdown-menu {
		left: -300px;
	}
	.top-menu .dropdown-menu::before {
		left: 335px;
	}
}

/*===========================================================================*/
/*1600px CSS*/
/*===========================================================================*/
@media ( max-width : 1600px) {
	#banner .caption {
		top: 170px;
	}
}
/*===========================================================================*/
/*1800px CSS*/
/*===========================================================================*/
@media ( max-width : 1800px) {
	#banner .caption {
		top: 155px;
	}
}
/*===========================================================================*/
/*1440px CSS*/
/*===========================================================================*/
@media ( max-width : 1440px) {
	#banner .caption {
		top: 170px;
	}
	#banner .caption span img {
		margin: 0 auto 0px;
	}
}

/*===========================================================================*/
/*767px CSS*/
/*===========================================================================*/
@media ( max-width : 767px) {
	#header {
		background: #222;
	}
	.top-menu .dropdown-menu {
		width: 100%;
	}
	.top-menu .dropdown-menu li strong.title,.top-menu .dropdown-menu li span,.top-menu .dropdown-menu li b
		{
		font-size: 15px;
		line-height: 18px;
	}
	#banner .caption {
		top: 10px;
	}
	.top-menu .dropdown-menu li .head,.top-menu .dropdown-menu li a {
		padding: 10px;
	}
	.top-menu .dropdown-menu li .head span.azan,.top-menu .dropdown-menu li .head span.time,.top-menu .dropdown-menu li a em,.top-menu .dropdown-menu li a strong.time
		{
		font-size: 12px;
		line-height: 12px;
	}
	#banner .caption span img {
		width: 100%;
		margin-bottom: 0;
	}
	#banner .caption strong.title {
		padding: 0 0 5px 0;
		margin: -5px 0 0 0;
		font-size: 23px;
	}
	#banner .caption h1 {
		font-size: 23px;
		margin: 0 0 10px 0;
	}
	#banner .caption .firma {
		font-size: 28px;
	}
	#banner .caption p {
		margin: 0 0 10px 0;
	}
	#banner .caption strong.title:before,#banner .caption strong.title:after
		{
		display: none;
	}
	.vision-box {
		margin-bottom: 30px;
	}
	.search-inner {
		width: 100%;
		padding-left: 15px;
		padding-right: 15px;
	}
	#nav {
		width: 100%;
		padding: 20px 0 0 0;
	}
	#nav li {
		float: none;
		display: block;
		padding-bottom: 20px;
	}
	#nav li a {
		padding: 0 0 8px 0;
	}
	#nav li ul,#nav li ul li>ul {
		position: static;
		width: 100%;
	}
	#banner {
		margin: 0;
	}
	.footer-section-1 {
		padding: 40px 0;
	}
	.footer-box {
		margin: 30px 0 0 0;
	}
	#inner-banner {
		margin-top: 0;
		padding: 10px 0;
	}
	#inner-banner .breadcrumb {
		margin: 5px 0 20px 0;
	}
	#inner-banner h1 {
		margin-top: 0;
	}
	.about-gallery .modal-dialog {
		width: 100%;
		padding: 0 30px;
		margin: 0;
	}
}

/*===========================================================================*/
/*480px CSS*/
/*===========================================================================*/
@media ( min-width : 320px) and (max-width: 480px) {
	#inner-banner h1 {
		font-size: 24px;
	}
	#inner-banner {
		margin-top: 0;
		padding: 20px 0;
	}
	#inner-banner h1 {
		margin-top: 0;
	}
	.about-gallery .modal-dialog {
		width: 100%;
		padding: 0 30px;
		margin: 0;
	}
	#header {
		background: #222;
	}
	a.logo {
		width: 100%;
		text-align: center;
		margin: 0 0 20px 0;
	}
	.header-right-topbar {
		width: 100%;
		text-align: center;
	}
	.header-right-topbar {
		margin: 0 0 10px 0;
	}
	.search-inner {
		width: 100%;
		padding-left: 15px;
		padding-right: 15px;
	}
	.top-menu {
		float: none;
		margin: 0;
		display: inline-block;
	}
	.top-menu li a {
		font-size: 14px;
		line-height: 14px;
	}
	.top-menu li+li::before {
		padding: 0 10px;
	}
	.top-menu .dropdown-menu {
		width: 100%;
	}
	#nav {
		padding: 15px 0 0 0;
	}
	#nav li {
		float: none;
		display: block;
		padding-bottom: 20px;
	}
	#nav li ul,#nav li ul li>ul {
		position: static;
		width: 100%;
	}
	#nav {
		float: left;
		width: 100%;
	}
	#nav li a {
		padding: 0 0 8px 0;
	}
	.top-menu .dropdown-menu li strong.title,.top-menu .dropdown-menu li span,.top-menu .dropdown-menu li b,.top-menu .dropdown-menu li .head span.azan,.top-menu .dropdown-menu li .head span.time
		{
		font-size: 15px;
		line-height: 18px;
	}
	.top-menu .dropdown-menu li a em,.top-menu .dropdown-menu li a strong.time
		{
		font-size: 12px;
		line-height: 12px;
	}
	.top-menu .dropdown-menu li .head,.top-menu .dropdown-menu li a {
		padding: 10px;
	}
	#banner {
		margin: 0;
	}
	#banner .caption {
		top: 8px;
	}
	#banner .caption span img,.event-box img {
		width: 100%;
	}
	#banner .caption span img {
		margin-bottom: 0;
	}
	#banner .caption strong.title:before,#banner .caption strong.title:after,#banner .caption p,.caption .btn-row,#banner .owl-next,#banner .owl-prev,.history-section .frame::before,.event-box .caption
		{
		display: none !important;
	}
	.history-section,.our-vision,.event-section,.gallery-style-1 {
		padding: 40px 0;
	}
	.vision-box,.event-box {
		margin-bottom: 30px;
	}
	.footer-section-1 {
		padding: 50px 0;
	}
	.footer-section-2 strong.copyright {
		font-size: 12px;
		text-align: center;
		width: 100%;
	}
	.footer-social {
		float: left;
		width: 100%;
	}
	.footer-social ul {
		width: 100%;
		text-align: center;
	}
	.footer-social ul li {
		float: none;
		display: inline-block;
	}
	.history-section .text-box {
		margin: 30px 0 0 0;
	}
	#banner .caption strong.title {
		padding-bottom: 7px;
		font-size: 24px;
	}
	#banner .caption h1 {
		font-size: 28px;
	}
	#banner .caption .firma {
		font-size: 38px;
	}
	.history-section .frame {
		padding: 0;
	}
	.history-section .frame img {
		width: 100%;
	}
	body table td,body table th {
		padding: 10px 18px;
	}
	body h2 {
		font-size: 19px !important;
	}
	body p {
		margin: 0 0 20px 0;
	}
	iframe,embed {
		height: 250px !important;
	}
	body blockquote {
		font-size: 18px;
		line-height: 26px;
		padding: 20px 30px;
	}
}

/*===========================================================================*/
/*768px And 992px CSS*/
/*===========================================================================*/
@media ( min-width : 768px) and (max-width: 992px) {
	body p {
		margin: 0 0 20px 0;
	}
	#inner-banner {
		padding: 20px 0;
	}
	#inner-banner h1 {
		margin-top: 0;
	}
	.about-gallery .modal-dialog {
		width: 100%;
		padding: 0 30px;
		margin: 0;
	}
	#header {
		background: #222;
	}
	.top-menu .dropdown-menu {
		width: 100%;
	}
	.top-menu .dropdown-menu li strong.title,.top-menu .dropdown-menu li span,.top-menu .dropdown-menu li b
		{
		font-size: 15px;
		line-height: 18px;
	}
	.top-menu .dropdown-menu li .head,.top-menu .dropdown-menu li a {
		padding: 10px;
	}
	.top-menu .dropdown-menu li .head span.azan,.top-menu .dropdown-menu li .head span.time,.top-menu .dropdown-menu li a em,.top-menu .dropdown-menu li a strong.time
		{
		font-size: 12px;
		line-height: 12px;
	}
	.navigation-row {
		margin: 30px 0 0 0;
	}
	#nav li a {
		font-size: 12px;
		line-height: 12px;
		padding: 11px 12px;
	}
	#nav li ul {
		left: inherit;
		right: 0;
	}
	#nav li ul li>ul {
		left: inherit;
		right: 100%;
	}
	#banner {
		margin: 0;
	}
	#banner .caption {
		top: 20px;
	}
	#banner .caption span img {
		margin-bottom: 0;
	}
	.history-section .frame {
		padding: 0;
	}
	.history-section .frame img {
		width: 100%;
	}
	.history-section .frame::before {
		display: none;
	}
	.parallax-section .right-box {
		width: 100%;
	}
	#banner .caption strong.title::before,#banner .caption strong.title:after
		{
		display: none;
	}
	#banner .caption strong.title {
		padding-bottom: 10px;
	}
	#banner .caption h1 {
		font-size: 22px;
		margin-bottom: 10px;
	}
	#banner .caption .firma {
		font-size: 24px;
	}
	#banner .caption p {
		margin-bottom: 10px;
	}
	input[type="text"],input[type="name"],input[type="email"],input[type="tel"],input[type="phone"],input[type="date"],input[type="image"],input[type="search"],input[type="password"]
		{
		font-size: 12px;
	}
	input[type="submit"],button[type="submit"] {
		padding: 13px 15px;
	}
	.footer-section-1 {
		padding: 40px 0;
	}
	iframe,embed {
		height: 300px !important;
	}
	body blockquote {
		padding: 20px 30px;
	}
}

/*===========================================================================*/
/*1199px CSS*/
/*===========================================================================*/
@media ( min-width : 993px) and (max-width: 1199px) {
	.top-menu .dropdown-menu {
		left: -300px;
	}
	.top-menu .dropdown-menu::before {
		left: 335px;
	}
	a.logo {
		margin-bottom: 30px;
	}
	#header {
		background: #222;
	}
	#nav li ul {
		left: inherit;
		right: 0;
	}
	#nav li ul li>ul {
		left: inherit;
		right: 100%;
	}
	#banner {
		margin: 0;
	}
	#banner .caption {
		top: 30px;
	}
	#banner .caption span img {
		margin-bottom: 30px;
	}
	#banner .caption h1 {
		font-size: 30px;
	}
	#banner .caption .firma {
		font-size: 32px;
	}
	#banner .caption p {
		margin: 0 0 25px 0;
	}
	.history-section .frame {
		padding: 0;
	}
	#inner-banner {
		margin-top: 0;
		padding: 50px 0;
	}
	#inner-banner h1 {
		margin-top: 0;
	}
	.about-gallery .modal-dialog {
		width: 100%;
		padding: 0 30px;
		margin: 0;
	}
	.about-gallery .frame .caption h3 {
		font-size: 18px;
	}
}